import React, { Component } from 'react';

import RaisedButton from 'material-ui/RaisedButton';
import SelectField from 'material-ui/SelectField';
import MenuItem from 'material-ui/MenuItem';
import Dialog from 'material-ui/Dialog';
import FlatButton from 'material-ui/FlatButton';
import TextField from 'material-ui/TextField';

import store from '../../stores/main';
import { getHotelAndPartnerAPI, postSecretNoAPI, getHotelListBySearchKey } from '../../services/API';
import R from 'ramda';
import async from 'async';

import Waiting from '../Waiting';
import Alert from '../Alert';

export default class PushSecretNo extends Component {


    // todo 酒店-伙伴搜索功能
    componentWillMount () {
      this.setState(store.dispatch({type:'OPEN_WAITING'}));
      async.series({
        hotels: (next) => {
          getHotelListBySearchKey({
            searchKey: ''
          },(res, err) => {
            if (err) {
              this.setState(store.dispatch({type:'OPEN_ALERT', re: err}));
            } else {
              if (res.statusNo == 200) {
                this.setState(store.dispatch({type: 'GET_HOTEL_LIST', data: res.data}));
                next(null);
              } else {
                this.setState(store.dispatch({type:'OPEN_ALERT', re: res.msg}));
              }
            }
          });
        },
        partners: (next) => {
          getHotelAndPartnerAPI((res, err) => {
            if (err) {
              this.setState(store.dispatch({type:'OPEN_ALERT', re:err}));
            } else {
              if (res.statusNo == 200) {
                this.setState(store.dispatch({type: 'GET_HOTEL_PARTNER', data: res.data}));
                next(null);
              } else {
                this.setState(store.dispatch({type:'OPEN_ALERT', re: res.msg}));
              }
            }
          });
        }
      });

    }

    openDialog () {
      this.setState(store.dispatch({type:'OPEN_WAITING'}));
      getHotelListBySearchKey({
        searchKey: this.state.defaultKey
      },(res, err) => {
        if (err) {
          this.setState(store.dispatch({type:'OPEN_ALERT', re: err}));
        } else {
          if (res.statusNo == 200) {
            if(res.data.hotelInfoList.length == 1) {
              this.getSecretInfo();
            } else {
              this.setState({openDialog: true});
            }
            this.setState(store.dispatch({type: 'GET_HOTEL_LIST', data: res.data}));
            this.setState(store.dispatch({type: 'SET_HOTEL_ID', data: res.data.hotelInfoList[0].hotelId}));
          } else {
            this.setState(store.dispatch({type:'OPEN_ALERT', re: res.msg}));
          }
        }
      });
    }

    constructor(props) {
        super(props);
        this.state = {
          openDialog: false,
          defaultKey: ''
        }
    }

    changeHotelName (e, value) {
      this.setState({defaultKey: value});
    }

    changeHotel (e, index, value) {
        this.setState(store.dispatch({type: 'SET_DOG_NO', data: value}));
    }

    changePartner (e, index, value) {
      this.setState(store.dispatch({type: 'SET_HOTEL_ID', data: value}));
    }

    sendSecretNo () {
      this.setState(store.dispatch({type:'OPEN_WAITING'}));
      postSecretNoAPI({
        dogNo: store.getState().dogNo,
        dealerNo: store.getState().hotelId
      }, (res, err) => {
        if (err) {
          this.setState(store.dispatch({type:'OPEN_ALERT', re:err}));
        } else {
          if (res.statusNo == 200) {
            this.setState(store.dispatch({type: 'OPEN_ALERT', re: '发行序列号成功!'}));
          } else {
            this.setState(store.dispatch({type:'OPEN_ALERT', re: res.msg}));
          }
        }
      });
    }

    closeDialog () {
      this.setState({openDialog: false});
    }

    render() {

        var state = store.getState();
        var hotelInfo = R.defaultTo([])(state.hotelInfo);
        var dealerInfo = R.defaultTo([])(state.dealerInfo);

        const pushSecretStyle = {
          margin: '150px auto 0',
          width: 400
        };

        const pushBtnStyle = {
          textAlign: 'center',
          marginTop: 50
        };

        //const actions = [
        //
        //  <RaisedButton
        //    label="确认"
        //    primary={true}
        //    onTouchTap={this.getSecretInfo.bind(this)}
        //    style={{marginRight: 20}}
        //    />,
        //  <FlatButton
        //    label="取消"
        //    primary={true}
        //    onTouchTap={this.closeDialog.bind(this)}
        //    />
        //];

        return (
            <div>
                <div style={pushSecretStyle}>
                    <div>

                        <SelectField
                            floatingLabelText="请选择酒店"
                            value={state.dogNo}
                            onChange={this.changeHotel.bind(this)}
                            style={{width:'100%'}}
                            >
                          {
                            R.keys(hotelInfo).map((val, ind) => {
                              return (
                                <MenuItem key={val} value={val} primaryText={hotelInfo[val]} />
                              )
                            })
                          }
                        </SelectField>
                    </div>
                    <div>
                        <SelectField
                            floatingLabelText="请选择伙伴"
                            value={state.hotelId}
                            onChange={this.changePartner.bind(this)}
                            style={{width:'100%'}}
                            >
                          {
                            R.keys(dealerInfo).map((val, ind) => {
                              return (
                                <MenuItem key={val} value={val} primaryText={dealerInfo[val]} />
                              )
                            })
                          }
                        </SelectField>
                    </div>
                    <div style={pushBtnStyle}>
                        <RaisedButton label="发行序列号" primary={true} onTouchTap={this.sendSecretNo.bind(this)}/>
                    </div>
                </div>

              <Waiting />
              <Alert />
            </div>
        )
    }
}
